<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>注册页面</title>
    <link href="css/common.css" rel="stylesheet">
    <link href="css/register.css" rel="stylesheet">
</head>
<body>
<!-- 背景层 -->
<div class="cover"></div>
  <!--导航栏-->
  <div class="nav">网页聊天</div>
  <!--主窗口区-->
  <div class="login-container">
    <!--        登录框-->
    <div class="login-dialog">
      <h3>注册</h3>
      <div class="row">
        <span>用户名</span>
        <input type="text" id="username">
      </div>
      <div class="row">
        <span>密码</span>
        <input type="password" id="password">
      </div>
      <div class="row">
        <button id="submit">注册</button>
      </div>
    </div>
</div>
  <script src="js/jquery.min.js"></script>
  <script>
    let submitButton = document.querySelector('#submit')
    submitButton.onclick = function () {
      // 1.获取用户输入
      let username = document.querySelector('#username').value
      let password = document.querySelector('#password').value
      if (username == '' || password == '') {
        alert("当前输入的用户名或密码为空！")
        return
      }

      // 2.构造请求
      $.ajax({
        url: '/user/register',
        type: 'post',
        data: {
          username: username,
          password: password
        },
        success: function (ret) {
          if (ret && ret.userId > 0){
            alert("注册成功！")
            location.assign('login.html')
          } else {
            alert("注册失败，用户名已存在！")
          }
        }
      })

    }
  </script>
</body>
</html>